<template>
    <div class="big">
        <section>
            <nav-bar tittle="奖项列表" :isBack="true"></nav-bar>
            <div v-for="(item, index) in awards" :key="item.id" :class="{ abc: true, }" class="jiang" @click="fn(item.id)">
                {{ item.title }}</div>
        </section>
    </div>
</template>
<script>
import axios from 'axios'
export default {
    data() {
        return {
            awards: []
        }
    },
    created() {
        axios.get('https://test-h5-api.ixook.com/awards').then(res => {
            console.log(res);
            this.awards = res.data.data
        })
    },
    methods: {
        fn(id) {
            this.$router.push(`/awardslist?id=${id}`)
        }
    }
}



</script>
<style lang="scss" scoped>
.jiang {
    width: 187.5px;
    height: 40px;
    border-bottom: 1px solid #ccc;
    float: left;
    line-height: 40px;
    text-align: center;
    border-right: 1px solid #ccc;
    box-sizing: border-box;
}
</style>